import { Component, Emit, Prop, Watch } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'
import renderModal, {
    getModelValue,
    initModelValue,
    type FormModalDto
} from '@/components/modal/Modal'
import type { InsureEnsurePlanListDto } from '@/api/insureEnsurePlan/types'
import { editInsureEnsurePlan } from '@/api/insureEnsurePlan'
@Component
export class SetTimePop extends Render {
    @Prop({ default: false }) show!: boolean
    @Prop() detailData!: InsureEnsurePlanListDto

    @Emit('update:show')
    showChange(val: boolean) {
        return val
    }

    @Emit('refresh')
    handleRefresh() {}

    @Watch('show', { immediate: true })
    async handleWatchShow() {
        this.formConfig.show = this.show
    }
    @Watch('formConfig.show', { immediate: true })
    handleWatchShowDialog() {
        this.showChange(this.formConfig.show)
    }
    formConfig = this.initFormConfig() as FormModalDto
    initFormConfig() {
        return {
            title: '时间设置',
            width: '520px',
            theme: 'dark',
            show: false,
            params: {
                confirmText: '确定'
            },
            items: {
                planStartTime: {
                    name: '生效时间',
                    element: 'datetime',
                    params: {
                        valueFormat: 'YYYY-MM-DD',
                        format: 'YYYY-MM-DD'
                    },
                    required: true
                },
                planEndTime: {
                    name: '截止时间',
                    element: 'datetime',
                    params: {
                        valueFormat: 'YYYY-MM-DD',
                        format: 'YYYY-MM-DD'
                    },
                }
            },
            complete: async () => {
                const data = getModelValue(this.formConfig)
                data.insureEnsurePlanId = this.detailData.id
                await editInsureEnsurePlan(data)
                this.formConfig.show = false
                this.handleRefresh()
                // this.showChange(false)
            },
            cancel: () => {
                this.formConfig.show = false
                // this.showChange(false)
            },
            init: () => {
                console.log(233, this.detailData)
                initModelValue(this.formConfig, this.detailData)
            }
        } as FormModalDto
    }
    render() {
        return <>{renderModal(this.formConfig)}</>
    }
}

export default toNative<{ detailData: InsureEnsurePlanListDto }, { refresh: () => void }>(
    SetTimePop
)
